<template>
  <Field
    v-if="hasValid"
    :border="border"
    v-model="currentValue"
    @change="$emit('change', currentValue, name)"
    :name="name"
    :label="label"
    :labelWidth="labelWidth"
    :disabled="disabled"
    :readonly="readonly"
    :placeholder="placeholder"
    :type="type"
    :rules="rules"
  >
    <template #input>
      <slot></slot>
    </template>
  </Field>
  <Field
    v-else
    :border="border"
    :name="name"
    :label="label"
    :labelWidth="labelWidth"
    :disabled="disabled"
    :readonly="readonly"
    :placeholder="placeholder"
    :type="type"
    :rules="rules"
  >
    <template #input>
      <slot></slot>
    </template>
  </Field>
</template>

<script>
import common from './item'
export default {
  mixins: [common],
  computed: {
    hasValid () {
      let v = this.value
      return typeof v === 'string' || typeof v === 'number'
    }
  }
}
</script>
